<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"> 
        <title>工单详情</title> 
        <link rel="stylesheet" href="css/innerstyle.css">
        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">  
	    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
	    <link rel="stylesheet" type="text/css" href="DataTables/datatables.min.css"/>
        <script type="text/javascript" src="DataTables/datatables.min.js"></script>
    </head>
    <body>
    <div class="mainborder">

        <h1>工单详情</h1>

        <form role="form">
            <div class="row">
                <div class="col-md-3">
                    <label >工单编号</label>
                    <input class="form-control" id="disabledInput" type="text" placeholder="123456" disabled>
                </div>
                <div class="col-md-3 form-group">
                    <label for="exampleInputName2">下达车间</label>
                    <select class="form-control">
                        <option>1</option>
                        <option>2</option>
                        <option>3</option>
                        <option>4</option>
                        <option>5</option>
                    </select>
                </div>
                <div class="col-md-3 form-group">
                    <label for="exampleInputEmail2">下单时间</label>
                    <input class="form-control" id="disabledInput" type="text" placeholder="2021-01-02" disabled>
                </div>
                <div class="col-md-3 form-group">
                    <label for="exampleInputEmail2">完成时间</label>
                    <input class="form-control" id="disabledInput" type="text" placeholder="有就显示否则没有" disabled>   
                </div>
            </div>
            <div class="form-group">
                <label for="exampleInputEmail2">产品名称</label>
                <input class="form-control" id="disabledInput" type="text" placeholder="产品名称" disabled>
            </div>
            <div class="form-group">
                <label for="exampleInputEmail2">产品编号</label>
                <input class="form-control" id="disabledInput" type="text" placeholder="产品编号" disabled>
            </div>
            <fieldset disabled>
                <div class="form-group">
                    <label for="exampleInputEmail2">开始时间</label>
                    <select class="form-control"  >
                        <option>开始时间</option>
                    </select>
                </div>
            </fieldset>
            <div class="form-group">
                <label for="exampleInputEmail2">产品工期</label>
                <input class="form-control" id="disabledInput" type="text" placeholder="产品工期">
            </div>
            <div class="form-group">
                <label for="exampleInputEmail2">订购数量</label>
                <input class="form-control" id="disabledInput" type="text" placeholder="订购数量">
            </div>
            <div class="form-group">
                <label for="exampleInputEmail2">客户名</label>
                <input class="form-control" id="disabledInput" type="text" placeholder="客户名">
            </div>
            <div class="form-group">
                <label for="exampleInputEmail2">联系方式</label>
                <input class="form-control" id="disabledInput" type="text" placeholder="联系方式">
            </div>
            <div class="form-group">
                <label for="exampleInputName2">下达车间</label>
                <select class="form-control">
                    <option>已完成</option>
                    <option>处理中</option>
                    <option>待处理</option>
                </select>
            </div>
            <div id="form-group" >
                <label for="exampleInputName2">产品工艺</label>
                <table id="myTable" class="table table-bordered">
                    <thead>
                        <tr>
                            <th>工艺序号</th>
                            <th>工艺名称</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>1</td>
                            <td>测试产品</td>
                        </tr>
                        <tr>
                            <td>2</td>
                            <td>测试产品</td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>测试产品</td>
                        </tr>
                        <tr>
                            <td>4</td>
                            <td>测试产品</td>
                        </tr>
                        <tr>
                            <td>5</td>
                            <td>测试产品</td>
                        </tr>
    
                    </tbody>
                </table>
            </div>
            <button type="submit" class="btn btn-default" style="float: right;">提交</button>
        </form>


    </div>
    
    <script>
        $(document).ready( function () {
            $('#myTable').DataTable({
                "bFilter": false,
                "bLengthChange": false,
                "oLanguage": {
                    "sProcessing": "正在加载中......",
                    "sLengthMenu": "每页显示 _MENU_ 条记录",
                    "sZeroRecords": "对不起，查询不到相关数据！",
                    "sEmptyTable": "表中无数据存在！",
                    "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
                    "sInfoFiltered": "数据表中共为 _MAX_ 条记录",
                    "sSearch": "搜索",
                    "oPaginate": {
                        "sFirst": "首页",
                        "sPrevious": "上一页",
                        "sNext": "下一页",
                        "sLast": "末页"
                    }
                }
            });
        } );

        
    </script>
</body>
</html>
